
* {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}

html,
body {
    width: 1440px;
    height: 100%;
    background-color: #f5f8f9
}

/* 页头 */
.header {
    /* width: 100%; */
    height: 100px;
    background-color: #fff;
    padding: 0 150px;
    display: flex;
    justify-content: space-between;
    align-items: center;

}

.LOGO {
    width: 105px;
    height: 30px;
    line-height: 30px;
    background-color: #f92525;
    text-align: center;
    color: #fff;
}

.setting {
    display: flex
}

.setting img {
    width: 40px;
    height: 40px;

}

.LOGOUT {
    width: 210px;
    height: 40px;
    line-height: 40px;
    background-color: #f92525;
    text-align: center;
    color: #fff;
    margin-left: 20px;
}

/* 内容主体区 */
.main {
    /* width: 100%; */
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 140px;

}

/* 页底 */
.footer {
    margin-top: 43px;
    width: 100%;
    height: 290px;
    background-color: #202124;
    box-sizing: border-box;
    padding: 80px 140px;
    display: flex;
    justify-content: left;

}

.footer ul {
    color: #fff;
    width: 100px;
    margin-left: 72px;
}

.footer ul li {
    height: 30px;
    line-height: 30px;
}


/* 导航栏 */
.navigator {
    width: 100%;
    height: 170px;
    margin: 10px;
    display: flex;
    justify-content: space-between;
    /* justify-content: center; */
    align-items: center;
}

.nav_left span {
    font-weight: bold;
}

.nav_right {
    display: flex;
    position: relative;
}

.nav_right li {
    width: 120px;
    height: 30px;
    line-height: 30px;
    box-sizing: border-box;
    /* padding-left: 20px; */
    font-weight: bold;
    text-align: center;
}

.selected {
    color: rgb(146, 146, 146)
}

.line {
    position: absolute;
    top: 30px;
    left: 10px;
    width: 100px;
    height: 4px;
    background-color: #cccfd0;
    transition: all 1s;
}

/* 左边轮播图 */
#Swiper {
    width: 560px;
    height: 288px;
    background-color: #fff;
    /* flex: none; */
    margin: 10px;
    position: relative;
    box-sizing: border-box;
    padding: 20px 19px;
    overflow: hidden;
}

#list {
    position: absolute;
    top: 20px;
    width: 3120px;
    height: 250px;
    z-index: 1;
    left: -560px;
    display: flex;

}

#list img {
    /* float: left; */
    width: 520px;
    height: 250px;
    margin: 0 20px;
}

#buttons {
    position: absolute;
    left: 45%;
    bottom: 20px;
    height: 10px;
    width: 80px;
    z-index: 2;
}

#buttons span {
    float: left;
    margin-right: 5px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #333;
    cursor: pointer;
    z-index: 2;
    border: 2px solid #b9beba;

}

#prev {
    left: 20px;
    position: absolute;
}

#next {
    right: 20px;
    position: absolute;
}

.arrow {
    position: absolute;
    top: 100px;
    z-index: 2;
    display: none;
    width: 30px;
    height: 120px;
    font-size: 36px;
    font-weight: bold;
    line-height: 120px;
    text-align: center;
    color: rgba(255, 255, 255, .6);
    background-color: rgba(0, 0, 0, .2);
}

#Swiper:hover .arrow {
    display: block;
}

#buttons .active {
    background: #f10215;
}



/* 右边信息表格 */
.listdetail {
    width: 560px;
    height: 288px;
    background-color: #fff;
    /* flex: none; */
    margin: 10px;
    box-sizing: border-box;

}

.listdetail div {
    padding: 0 50px;
}

.listdetail-top {
    height: 110px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.View-All {
    box-sizing: border-box;
    /* background-color: #f5f8f9; */
    text-align: center;
    height: 40px;
    line-height: 36px;
    width: 95px;
    border: 2px solid #cccfd0;
}

.listdetail-bottom {
    text-align: center;
    height: 175px;
}

.table {
    height: 175px
}

.Solved {
    box-sizing: border-box;
    /* background-color: #f5f8f9; */
    text-align: center;
    height: 30px;
    line-height: 30px;
    width: 65px;
    background-color: #5dd054;
    color: #fff;

}


/* Echarts图标 */
.Chart {
    width: 1140px;
    height: 349px;
    background-color: #fff;
    /* flex: none; */
    margin: 10px;
}

.PieChart {
    width: 560px;
    height: 377px;
    background-color: #fff;
    /* flex: none; */
    margin: 10px;
}

.Histogram {
    width: 560px;
    height: 377px;
    background-color: #fff;
    /* flex: none; */
    margin: 10px;
}